import React,{Component} from "react"
import  "../css/slide.css"
var pic1=require("../images/1454917.jpg")
var pic2=require("../images/1455931.jpg")
var pic3=require("../images/w710h400z1l50t10e8.jpg")


export default class Slide extends  Component{
    constructor(props){
        super(props)
        this.state={msg:[{id:0,url:pic1},{id:1,url:pic2},{id:2,url:pic3}]}
    }
    componentDidMount(){
        setInterval(()=>{
            var del_arr=this.state.msg.shift()
            this.state.msg.push(del_arr)
            this.setState({
                msg:this.state.msg
            })
        },3000)
    }
    render(){
        return(
            <ul className="slide_ul" >
                {
                      this.state.msg.map(function(v){
                          return(
                              <li key={v.id}  style={{background:"url("+v.url+") no-repeat",backgroundSize:"100% 100%"}}></li>
                          )
                      })
                }
            </ul>
        )
    }
}

